<template>
	<view class="container">
		<image class="dian" src="../../static/login/Ellipse16.png" mode="top"></image>
		<view class="logo"><b>修改密码</b></view>

		<uni-forms :modelValue="formData">
			<uni-forms-item>
				<text class="text-label">账号</text>
				<uni-easyinput v-if="!uid" type="text" v-model="formData.uid" />
				<view v-if="uid">{{uid}}</view>
			</uni-forms-item>

			<uni-forms-item>
				<text class="text-label">手机验证码</text>
				<uni-row>
					<uni-col :span="16">
						<uni-easyinput type="number" v-model="formData.mailCode" />
					</uni-col>
					<uni-col :span="8" >
						<button class="btn-blue" style="padding-left: 5px;height:35px;font-size: 14px;" :disabled="sta!='normal'" @click="onClickSendMailCode">{{btnStr()}}</button>
					</uni-col>
				</uni-row>
			</uni-forms-item>

			<uni-forms-item>
				<text class="text-label">密码</text>
				<uni-easyinput type="password" pa v-model="formData.pwd" />
				<text style="font-size: 11px;font-weight: 500;color: #999999;">*密码为8-20位,数字、字母和特殊字符至少两种</text>
			</uni-forms-item>
			<uni-forms-item>
				<text class="text-label">确认密码</text>
				<uni-easyinput type="password" pa v-model="formData.confirmPwd" />
			</uni-forms-item>
		</uni-forms>
		<view style="padding: 30px;"></view>
		<button class="btn-blue" @click="onClickReset">提交</button>
	</view>
</template>

<script>
	import { resetPwd, sendSmsCode } from '../../net/http'
	import { websock } from '../../net/websock'

	export default {
		data() {
			return {
				formData: {
					uid: '',
					mailCode: '',
					pwd: '',
					confirmPwd: ''
				},
				uid: 0,
				timer: null,
				sta: 'normal',
				countDown: 60000
			}
		},
		onLoad(params) {
			this.uid = params.uid || 0
			this.timer = setInterval(() => {
				if (this.sta == 'countdown') {
					this.countDown -= 100
					if (this.countDown < 0) {
						this.sta = 'normal'
						this.countDown = 60000
					}
				}
			}, 100);
		},
		onUnload() {
			clearInterval(this.timer)
		},
		methods: {
			btnStr() {
				if (this.sta == 'normal') return '获取验证码'
				return parseInt(this.countDown / 1000) +'S'
			},
			onClickSendMailCode() {
				let uid = this.uid || parseInt(this.formData.uid)
				if (!uid) return uni.showToast({title: '请输入账号',icon:'none'})
				this.sta = 'countdown'

				sendSmsCode(uid, res => {
					let data = res.data
					if (data.code != 0) {
						return uni.showToast({title: data.message})
					}
					console.log('send mail', res)
					this.sta = 'countdown'
					this.countDown = 60000
				}, () => {
					uni.showToast({ title: '发送失败，请检查网络连接' ,icon:'none'})
				})
			},
			onClickReset() {

				let uid = this.uid || parseInt(this.formData.uid)
				if (!uid) return uni.showToast({title: '请输入账号'})

				if (!this.formData.mailCode) return uni.showToast({
					title: '请输入验证码'
				})

				if (!this.formData.pwd) return uni.showToast({
					title: '请输入密码'
				})

				if (this.formData.pwd.length < 8) return uni.showToast({
					title: '密码小于8位'
				})

				if (this.formData.pwd.length > 20) return uni.showToast({
					title: '密码大于20位'
				})

				let specialCharStr = '`~!@#$%^&*()-_=+\\|;:\'"",<.>/?'
				let numStr = '1234567890'
				let letterStr = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ'
				let hasSpecailChar = false
				let hasNum = false
				let hasLetter = false

				for (let i = 0; i < this.formData.pwd.length; i++) {
					if (specialCharStr.indexOf(this.formData.pwd[i]) != 1) hasSpecailChar = true
					if (numStr.indexOf(this.formData.pwd[i]) != 1) hasNum = true
					if (letterStr.indexOf(this.formData.pwd[i]) != 1) hasLetter = true
				}

				if (~~hasSpecailChar + ~~hasNum + ~~hasLetter < 2) return uni.showToast({
					title: '数字、字母和特殊字符至少要两种',icon:'none'
				})

				if (!this.formData.confirmPwd) return uni.showToast({
					title: '请确认密码',icon:'none'
				})

				if (this.formData.pwd != this.formData.confirmPwd) return uni.showToast({
					title: '两次密码不一致',icon:'none'
				})

				// uni.showLoading({ mask: true })

				resetPwd(uid, this.formData.mailCode, this.formData.pwd, res => {
					console.log('reset pwd', res.data)
					if (res.data.code != 0) return uni.showToast({
						title: res.data.msg
					})
					uni.showToast({
						title: '重置成功'
					})
					uni.setStorageSync('uid', 0)
					uni.setStorageSync('token', '')
					store.uid = 0
					store.token = ''
					store.userInfo = null
					store.departList = null
					store.posList = null
					store.contachtList = null

					websock.disconnect()

					uni.redirectTo({ url: '/pages/login/index' })
				}, () => {
					uni.showToast({
						title: '重置出错，请检查网络连接'
					})
				}, () => {
					uni.hideLoading()
				})
			}
		}
	}
</script>

<style>
	.container {
		padding-left: 20px;
		padding-right: 20px;
		font-size: 14px;
		line-height: 24px;		
		background: linear-gradient(to bottom, #E8F5FD 50%, #F5F5F5 100%);
		background-repeat: no-repeat;
		background-size: 100%;

	}

	.dian {
		width: 56px;
		height: 56px;
		padding-top: 30px;
		padding-left: 250px;
	}

	.logo {
		padding-top: 1px;
		padding-left: 20px;
		padding-bottom: 34px;
		font-size: 32px;
		color: black;
		line-height: 1.5;

	}

	.form-input {
		height: 50px;
	}

	.demo-uni-col {
		height: 36px;
		border-radius: 3px;
	}

	.text-label {
		font-size: 14px;
		font-weight: 400;
		color: #858597;
		line-height: 16px;
		padding-bottom: 2px;
	}

	.text-link {
		color: #3D7FFF;
		padding: 10px 0px 30px;
		font-size: 12px;
	}

	.text-min {
		color: #858597;
		padding: 10px 0px 30px;
		font-size: 11px;
	}

	.text-center {
		text-align: center;
	}

	.text-right {
		text-align: right;
	}

	.btn-blue {
		background-color: dodgerblue;
		color: aliceblue;
	}
</style>
